import { $cancelAnimationFrame, $requestAnimationFrame, $window, AmbientLight, DirectionalLight, PerspectiveCamera, PLATFORM, Scene, sRGBEncoding, WebGL1Renderer } from 'three-platformize'
import { WechatPlatform } from 'three-platformize/src/WechatPlatform'
import { GLTF, GLTFLoader } from 'three-platformize/examples/jsm/loaders/GLTFLoader'
import { OrbitControls } from 'three-platformize/examples/jsm/controls/OrbitControls'

Page({
  modelId: '',
  modelSrc: '',
  disposing: false,
  platform: null as unknown as WechatPlatform,
  frameId: -1,
  onToMoney() {
    wx.navigateTo({
      url: '/pages/order/placeOrder?pageType=single&id=' + this.modelId,
    })
  },
  onLoad(options) {
    console.log('模型参数：', options)
    this.modelId = options.modelId;
    this.modelSrc = decodeURIComponent(options.modelSrc);
    // this.modelSrc = 'https://ders-1312669922.cos.ap-guangzhou.myqcloud.com/584a68eba826b342ec671f5e6ce21605/22/avatar/model.gltf';
  },
  async onReady() {
    wx.showLoading({ mask: false, title: '加载中' })
    wx.createSelectorQuery().select('#gl').node().exec(async (res) => {
      const canvas = res[0].node

      this.platform = new WechatPlatform(canvas)
      PLATFORM.set(this.platform);

      const renderer = new WebGL1Renderer({ canvas, antialias: true, alpha: true })
      const camera = new PerspectiveCamera(75, canvas.width / canvas.height, 0.1, 1000);
      const scene = new Scene()
      const gltfLoader = new GLTFLoader()
      const controls = new OrbitControls(camera, canvas);
      controls.enableDamping = true

      let gltfSrc = 'https://dtmall-tel.alicdn.com/edgeComputingConfig/upload_models/1591673169101/RobotExpressive.glb';
      gltfSrc = 'https://ders-1312669922.cos.ap-guangzhou.myqcloud.com/584a68eba826b342ec671f5e6ce21605/22/avatar/model.gltf'
      // console.log('加载地址：',this.modelSrc)
      let gltf = await gltfLoader.loadAsync(this.modelSrc);
      // @ts-ignore
      gltf.parser = null;
      // gltf.scene.position.y = -2;
      scene.add(gltf.scene);

      camera.position.z = 1
      renderer.outputEncoding = sRGBEncoding
      scene.add(new AmbientLight(0xffffff, 1.0))
      scene.add(new DirectionalLight(0xffffff, 1.0))
      renderer.setSize(canvas.width, canvas.height)
      renderer.setPixelRatio($window.devicePixelRatio)

      const render = () => {
        if (!this.disposing) this.frameId = $requestAnimationFrame(render)
        controls.update()
        renderer.render(scene, camera);
      }
      render();
      wx.hideLoading();
    })
  },

  onUnload() {
    this.disposing = true
    $cancelAnimationFrame(this.frameId)
    PLATFORM.dispose()
  },

  onTX(e: any) {
    this.platform.dispatchTouchEvent(e)
  },
})
